<script setup>
    import { defineProps, ref } from 'vue'

    const props = defineProps({
        config:{
            type: Object,
            default: () => {
                return {
                    title: '标题',
                    content: '内容',
                    trigger: '',
                    placement: 'bottomLeft'
                }
            }
        }
    })

    const open = ref(false)
</script>

<template>
    <div class="base_apopover">
        <a-popover
        :overlayStyle="{width: 'auto'}"
        color="#262628"
        :getPopupContainer="
            triggerNode => {
                return triggerNode.parentNode;
            }
            "
        :placement="props.config.placement" 
        :trigger="props.config.trigger">
            <template #content>
              <slot name="content">
                <span style="color: #8d8d91">
                    气泡
                </span>
              </slot>
            </template>
            <template #title>
              <slot name="title"></slot>
            </template>
            <div style="min-width: 200px;">
                <slot name="target">
        
                </slot>

            </div>
        </a-popover>
    </div>
</template>


<style lang="less" scoped>
::deep(.ss-popover-inner){
    background-color: #000000;

}
.base_apopover{
    width: 100%;
    color: #fff;
}

</style>